<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title id="t1" class="tt">第二题</title>
		<style type="text/css">
			#d1{
				width: 150px;
				height: 50px;
				background-color: red;
			}
			#d2{
				width: 150px;
				height: 50px;
				background-color: yellow;
			}
			#d3{
				width: 150px;
				height: 50px;
				background-color: green;
			}
		</style>
	</head>
	<body>
		<div id="d1">
			<p id="p1" class="pp">第一个div中的p1</p>
		</div>
		<div id="d2">
			<p id="p2" class="pp">第二个div中的p2</p>
		</div>
		<div id="d3" class="baseDIV">
			<p id="p3">第三个div中的p3</p>
		</div>
		<p id="p4">p4</p>
		<p id="p5">p5</p>
		<img src="./img/屏幕截图%202021-10-23%20154149.png" id="i1" class="ii">
		<ul id="u1" class="uu">
			<li>列表</li>
		</ul>
		<button type="button" onclick="aa()">div查看</button>
		<button type="button" onclick="bb()">标题查看</button>
		<button type="button" onclick="cc()">P标签查看</button>
		<button type="button" onclick="dd()">img查看</button>
		<button type="button" onclick="ee()">列表查看</button>
	</body>
	<script type="text/javascript">
		function aa(){
			var div1obj = document.getElementById('d1');
			console.log(div1obj);
			var div2obj = document.getElementsByClassName('baseDIV');
			console.log(div2obj);
			var div3obj = document.getElementsByTagName('div');
			console.log(div3obj);
		}
		function bb(){
			var t1obj = document.getElementById('t1');
			console.log(t1obj);
			var t2obj = document.getElementsByClassName('tt');
			console.log(t2obj);
			var t3obj = document.getElementsByTagName('title');
			console.log(t3obj);
		}
		function cc(){
			var p1obj = document.getElementById('p1');
			console.log(p1obj);
			var p2obj = document.getElementsByClassName('pp');
			console.log(p2obj);
			var p3obj = document.getElementsByTagName('p');
			console.log(p3obj);
		}
		function dd(){
			var i1obj = document.getElementById('i1');
			console.log(i1obj);
			var i2obj = document.getElementsByClassName('ii');
			console.log(i2obj);
			var i3obj = document.getElementsByTagName('img');
			console.log(i3obj);
		}
		function ee(){
			var u1obj = document.getElementById('u1');
			console.log(u1obj);
			var u2obj = document.getElementsByClassName('uu');
			console.log(u2obj);
			var u3obj = document.getElementsByTagName('ul');
			console.log(u3obj);
		}
	</script>
</html>
